<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>学科管理系统</title>
    <link rel="stylesheet" href="http://g.alicdn.com/sj/dpl/1.4.3/css/sui.min.css" />
    <link rel="stylesheet" href="http://g.alicdn.com/sj/dpl/1.4.3/css/sui-append.min.css" />
  </head>
  <body>

        <div class="sui-navbar">
          <div class="navbar-inner"><a href="#" class="sui-brand">SUI</a>
            <ul class="sui-nav">
              <li class="active"><a href="#">首页</a></li>
              <li><a href="#">组件</a></li>
              <li class="sui-dropdown"><a href="javascript:void(0);" data-toggle="dropdown" class="dropdown-toggle">其他 <i class="caret"></i></a>
                <ul role="menu" class="sui-dropdown-menu">
                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">关于</a></li>
                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">项目组成员</a></li>
                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">版权</a></li>
                </ul>
              </li>
            </ul>
            <form class="sui-form sui-form pull-left">
              <input type="text" placeholder="宝贝/店铺名称...">
              <button class="sui-btn">搜索</button>
            </form>
            <ul class="sui-nav pull-right">
              <li><a href="#">个人中心</a></li>
              <li><a href="#">帮助</a></li>
            </ul>
          </div>
        </div>
      
        <div class="sui-layout ui-sortable">
          <div class="sidebar ui-sortable">
        <ul class="sui-nav nav-list">
          <li class="nav-header">服装</li>
          <li class="active"><a href="#">阿迪达斯</a></li>
          <li><a href="#">耐克</a></li>
          <li><a href="#">New Balance</a></li>
          <li class="nav-header">美食</li>
          <li><a href="#">湘菜</a></li>
          <li><a href="#">自助</a></li>
          <li><a href="#">日料</a></li>
        </ul>
      </div>
          <div class="content ui-sortable">
        <div class="sui-pagination">
          <ul>
            <li class="prev disabled"><a href="#">«上一页</a></li>
            <li class="active"><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
            <li><a href="#">4</a></li>
            <li><a href="#">5</a></li>
            <li class="dotted"><span>...</span></li>
            <li class="next"><a href="#">下一页»</a></li>
          </ul>
          <div><span>共10页&nbsp;</span><span>
              到 <input type="text" class="page-num"><button class="page-confirm" onclick="alert(1)">确定</button> 页</span></div>
        </div>
      </div>
        </div>
          <script type="text/javascript" src="http://g.alicdn.com/sj/lib/jquery/dist/jquery.min.js"></script>
    <script type="text/javascript" src="http://g.alicdn.com/sj/dpl/1.4.3/js/sui.min.js"></script>
  </body>
</html>